<template>
  <div class="main-table-content noBorder">

    <el-tabs type="border-card">

      <!-- 系统配置-->
      <el-tab-pane>
        <template #label>
          <el-icon>
            <Money/>
          </el-icon>
          <span style="margin-left: 2px">系统配置</span>
        </template>

        <el-form ref="formDataRef" size="default" :model="formData" :rules="formRules" label-width="100">
          <el-form-item label="是否允许用户登录" prop="sys_user_login_is_disable" label-width="130">
            <el-switch v-model="formData.sys_user_login_is_disable"
                       active-value="0"
                       active-text="允许用户登录"
                       inactive-value="1"
                       inactive-text="已禁止用户登录"
                       class="ml-2" inline-prompt
                       style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
            />
          </el-form-item>
        </el-form>

        <div class="fxCenCen pdt10" style="border-top: 1px solid #E0E0E0">
          <el-button type="primary" @click="submitEdit" style="width: 200px" size="large">保 存</el-button>
        </div>

      </el-tab-pane>

      <!--全部字典-->
      <el-tab-pane>
        <template #label>
          <el-icon>
            <Money/>
          </el-icon>
          <span style="margin-left: 2px">全部字典</span>
        </template>
        <SysDict></SysDict>
      </el-tab-pane>

      <!--  枚举字典-->
      <el-tab-pane>
        <template #label>
          <el-icon>
            <el-icon>
              <ChromeFilled/>
            </el-icon>
          </el-icon>
          <span style="margin-left: 2px">OptionTag</span>
        </template>
        <SysDictEnum></SysDictEnum>
      </el-tab-pane>

    </el-tabs>


  </div>

</template>

<script setup>
import {getCurrentInstance, onMounted, ref} from "vue";
import $modal from "@/common/utils/modal";
import {apiSettingSelect, apiSettingUpdate} from "@/api/system";
import SysDict from "@/view/sys/sysDict";
import SysDictEnum from "@/view/sys/sysDictEnum";

const {proxy} = getCurrentInstance();

let optionKey = {
  loading: false,
}

let formKey = {
  sys_user_login_is_disable: "0",
}

const formRules = ref({
  dictName: [{required: true, message: "不能为空", trigger: "blur"}],
});

const option = ref(optionKey);

const formData = ref(formKey);


//页面加载完成回调
onMounted(() => {
  searchData()
})

//搜索数据
function searchData() {
  let keys = Object.keys(formData.value).join(",")

  apiSettingSelect({keys}).then(res => {
    if (res.success) {
      formData.value = res.data
    }
  })

}

function submitEdit() {
  console.log("formData.value  ", formData.value)
  let content = `正在修改配置信息，请确认是否继续操作？ `
  $modal.confirmWarning(content).then(() => {
    proxy.$refs["formDataRef"].validate(valid => {
      if (valid) {
        apiSettingUpdate(formData.value).then(res => {
          if (res.success) {
            $modal.success();
          }
        })
      }
    });
  }).catch(() => $modal.cancel());
}
</script>

<style scoped lang="less">

</style>